<template>
  <div class="paperContainer">
    <main-tbl
      index
      :select="select"
      :columns="columns"
      :data="tableData"

      :total="total"
      :current="current"
      :pageSize="pageSize"
      @on-page-size-change="sizeChange"
      @on-change="pageChange"
      @handleSelect="handleSelect"
    >
      <Form :model="queryForm" slot="query" :label-width="100" ref="queryForm">
        <Row>
          <Col :span="6">
            <FormItem label="培训任务名称：" prop="question">
              <Input
                v-model="queryForm.question"
                :maxlength="NAME_LENGTH_LIMIT"
                placeholder="请输入培训任务名称"
              />
            </FormItem>
          </Col>
          <Col :span="6">
            <FormItem label="培训类型：" prop="train_type">
              <Select v-model="queryForm.train_type" label="全部">
                <Option :value="''">全部</Option>
                <Option :value="item.code" v-for="item in eprList" :key="item.code">{{item.name}}</Option>
              </Select>
            </FormItem>
          </Col>
          <Col :span="6">
            <FormItem label="培训开始时间：" prop="train_type">
              <DatePicker type="date" placeholder="请输入培训开始时间"></DatePicker>
            </FormItem>
          </Col>
          <Col :span="6">
            <FormItem label="培训结束时间：" prop="train_type">
              <DatePicker type="date" placeholder="请输入培训结束时间"></DatePicker>
            </FormItem>
          </Col>
        </Row>
        <Row>
          <Col :span="6">
            <FormItem label>
              <Button type="primary" class="mr10" @click="handleQuery" size="small">查询</Button>
              <Button type="default" @click="handleReset" size="small">重置</Button>
            </FormItem>
          </Col>
        </Row>
      </Form>
      <template slot="actionbar">
        <Button type="primary" @click="handleAdd" icon="md-add" class="mr10">添加</Button>
        <Button
          type="error"
          icon="md-trash"
          @click="handleBatchDelete"
          class="mr10"
          v-if="select"
        >批量删除</Button>
      </template>
    </main-tbl>
    <plan-form :formData="formData" @handleCancel="handleCancel"></plan-form>
  </div>
</template>

<script>
import MainTbl from '_c/common/mainTbl'
import PlanForm from '_c/train/plan/planForm'
import mixin from '@/mixin'
export default {
  name: 'planContainer',
  mixins: [mixin],
  components: {
    MainTbl,
    PlanForm
  },
  data () {
    return {
      total: 0,
      current: 1,
      pageSize: 10,
      select: false,
      columns: [
        {
          title: '培训任务名称',
          align: 'center',
          key: 'username'
        },
        {
          title: '培训对象',
          align: 'center',
          key: 'realName'
        },
        {
          title: '培训类型',
          align: 'center',
          key: 'realName'
        },
        {
          title: '培训方式',
          align: 'center',
          key: 'sex'
        },
        {
          title: '是否需要考试',
          align: 'center',
          key: 'deptName'
        },
        {
          title: '培训开始时间',
          align: 'center',
          key: 'deptName'
        },
        {
          title: '培训结束时间',
          align: 'center',
          key: 'deptName'
        },
        {
          title: '操作',
          //   fixed: 'right',
          width: window.$config.columnWidth.cc,
          align: 'center',
          render: (h, params) => {
            let r = null
            if (params.status === '1') {
              r = h('div', [
                h(
                  'a',
                  {
                    attr: {
                      href: 'javascript:void(0)'
                    },
                    class: 'mc',
                    on: {
                      click: e => {}
                    }
                  },
                  '结果分析'
                )
              ])
            } else {
              r = h('div', [
                h(
                  'a',
                  {
                    attr: {
                      href: 'javascript:void(0)'
                    },
                    class: 'mc',
                    on: {
                      click: e => {
                        this.formData = {
                          title: '编辑',
                          showForm: true,
                          type: 1,
                          info: params.row
                        }
                      }
                    }
                  },
                  '编辑'
                )
              ])
            }
            return r
          }
        }
      ],
      tableData: [],
      tableSelection: [],
      queryItems: {},
      queryForm: {
        question: '',
        question_type: '',
        train_type: ''
      },
      formData: {
        showForm: false,
        type: 0,
        title: '',
        info: ''
      },
      eprList: []
    }
  },
  created () {
    this.init()
  },
  methods: {
    init () {
      this.handleQuery()
    },
    // 查询
    handleQuery () {
      this.current = 1
      this.queryItems = { ...this.queryForm }
      this.query(this.queryItems)
    },
    // 重置
    handleReset () {
      this.$refs.queryForm.resetFields()
      this.deptIdData = ''
      this.queryForm.deptId = []
      this.treeData = []
      this.current = 1
      this.queryItems = {}
      this.query(this.queryItems)
      this.formData = {
        showForm: false,
        type: 0,
        title: '',
        info: ''
      }
    },
    // 列表
    query (query) {
      //   getUserList(this.current, this.pageSize, query).then(res => {
      //     this.tableData = res.records
      //     this.total = res.total
      //   })
      this.tableData = [{ test: '0' }]
    },
    delete (ids) {
      //   deleteUser(ids).then(res => {
      //     this.$Message.success('删除成功')
      //     this.tableSelection = []
      //     this.handleReset()
      //   })
    },

    // 分页
    sizeChange (e) {
      this.pageSize = e
      this.query()
    },
    pageChange (e) {
      this.current = e
      this.query()
    },
    // 关闭
    handleCancel () {
      this.formData.showForm = false
    },
    // 复选框选中的数据
    handleSelect (d) {
      this.tableSelection = d
    },
    // 添加
    handleAdd () {
      this.formData.title = '添加'
      this.formData.showForm = true
      this.formData.type = 0
    },

    // 批量删除
    handleBatchDelete () {
      if (!this.tableSelection.length) {
        this.$Message.warning('请选择要删除的数据')
      } else {
        this.$Modal.confirm({
          title: '提示',
          content: '<p>确定删除吗？</p>',
          onOk: () => {
            let tableSelection = this.tableSelection
            let ids = tableSelection.map(item => item.id)
            if (ids.length) {
              ids = ids.join(',')
            }
            this.delete(ids)
          },
          onCancel: () => {}
        })
      }
    },
    // 导入
    handleImport () {},
    // 下载
    handleDownLoad () {}
  }
}
</script>

<style lang="less" scoped>
</style>
